<template>
  <page-frame>
    <div class="org">
      <div class="toptitle">
        <div class="left" style="padding-bottom:1px;">机构管理</div>
        <div class="right">
          <div class="btns">
            <el-button v-show="addOrgButtonStatus" @click="addOrg">添加机构</el-button>
            <el-button class="lightGreenBtn" @click="save('ruleForm')" v-show="saveStatus">保存</el-button>
          </div>
        </div>
      </div>
      <div class="borderT"></div>
      <div class="order-content">
        <div class="input">
          <el-row v-show="treeStatus">
            <el-col :span="7">
              <div class="buildingEdit2">
                <el-input
                  placeholder="请输入机构名称进行查找"
                  v-model="filterText" style="width:100%!important;">
                </el-input>
                <el-tree
                  class="treeTop"
                  :data="orgTree"
                  :props="defaultProps"
                  default-expand-all
                  :render-content="renderContent"
                  :filter-node-method="filterNode"
                  @node-click="handleNodeClick"
                  ref="tree2">
                </el-tree>
              </div>
            </el-col>
            <el-col :span="14" :offset="2" v-show="orgDetailStatus">
              <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="165px" class="demo-ruleForm">
                <el-form-item label="机构名称" prop="orgName">
                  <el-input
                    placeholder="请输入养老院名称"
                    v-model="ruleForm.institutionInfoDTO.orgName"
                    :disabled="infoStatus"
                  >
                  </el-input>
                </el-form-item>
                <el-form-item label="机构类型" prop="">
                  <el-select v-model="orgType" placeholder="请选择机构类型" class="width66" :disabled="infoStatus">
                    <el-option
                      v-for="item in orgTypeOptions"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                    >
                    </el-option>
                  </el-select>
                </el-form-item>
                <el-form-item label="地理位置" class="location">
                  <el-select v-model="province" placeholder="请选择省份" @change="changeProvince" class="province" :disabled="infoStatus">
                    <el-option
                      v-for="item in provinceOptions"
                      :key="item.level"
                      :label="item.regionName"
                      :value="item.regionNo">
                    </el-option>
                  </el-select>
                  <el-select v-model="city" placeholder="请选择市" class="city" @change="changeCity" :disabled="infoStatus">
                    <el-option
                      v-for="item in cityOptions"
                      :key="item.level"
                      :label="item.regionName"
                      :value="item.regionNo">
                    </el-option>
                  </el-select>
                  <el-select v-model="area" placeholder="请选择区" class="area" :disabled="infoStatus">
                    <el-option
                      v-for="item in areaOptions"
                      :key="item.level"
                      :label="item.regionName"
                      :value="item.regionNo">
                    </el-option>
                  </el-select>
                  <el-input
                    placeholder="请填写具体位置"
                    style="margin-top:10px;"
                    v-model="ruleForm.institutionInfoDTO.address"
                    :disabled="infoStatus"
                  >
                  </el-input>
                </el-form-item>
                <el-row style="margin-bottom:22px;">
                  <el-col :span="3">
                    <p class="warn attention"><span class="">注意：</span></p>
                  </el-col>
                  <el-col :span="16" class="warnTips">
                    <p class="warn"><span>管理员登录账号为下框输入手机号码、密码为手机号码后六位</span></p>
                  </el-col>
                </el-row>
                <el-form-item label="机构管理员">
                  <el-input
                    placeholder="请输入管理员联系方式"
                    v-model="ruleForm.institutionInfoDTO.phone"
                    :disabled="infoStatus"
                  >
                  </el-input>
                </el-form-item>
                <div class="other">
                  <el-row>
                    <el-col :span="12">
                      <el-form-item label="机构所属行政区划">
                        <el-input
                          placeholder="请输入机构所属行政区划"
                          v-model="ruleForm.institutionInfoDTO2.orgRegion"
                          :disabled="infoStatus"
                        >
                        </el-input>
                      </el-form-item>
                    </el-col>
                    <el-col :span="12">
                      <el-form-item label="养老机构类型">
                        <el-input
                          placeholder="请输入养老机构类型"
                          v-model="ruleForm.institutionInfoDTO2.orgType"
                          :disabled="infoStatus"
                        >
                        </el-input>
                      </el-form-item>
                    </el-col>
                  </el-row>
                  <el-row>
                    <el-col :span="12">
                      <el-form-item label="设计床位数" >
                        <el-input
                          placeholder="请输入设计床位数"
                          v-model="ruleForm.institutionInfoDTO2.designBeds"
                          :disabled="infoStatus"
                        >
                          <template slot="append">张</template>
                        </el-input>
                      </el-form-item>
                    </el-col>
                    <el-col :span="12">
                      <el-form-item label="用地来源" >
                        <el-input
                          placeholder="请输入用地来源"
                          v-model="ruleForm.institutionInfoDTO2.resource"
                          :disabled="infoStatus"
                        >
                        </el-input>
                      </el-form-item>
                    </el-col>
                  </el-row>
                  <el-row>
                    <el-col :span="12">
                      <el-form-item label="占地面积" >
                        <el-input
                          placeholder="请输入占地面积"
                          v-model="ruleForm.institutionInfoDTO2.floorArea"
                          :disabled="infoStatus"
                        >
                          <template slot="append">平方米</template>
                        </el-input>
                      </el-form-item>
                    </el-col>
                    <el-col :span="12">
                      <el-form-item label="房产来源" >
                        <el-input
                          placeholder="请输入房产来源"
                          v-model="ruleForm.institutionInfoDTO2.sourceOfRealEstate"
                          :disabled="infoStatus"
                        >
                        </el-input>
                      </el-form-item>
                    </el-col>
                  </el-row>
                  <el-row>
                    <el-col :span="12">
                      <el-form-item label="建筑面积" >
                        <el-input
                          placeholder="请输入建筑面积"
                          v-model="ruleForm.institutionInfoDTO2.coveredArea"
                          :disabled="infoStatus"
                        >
                          <template slot="append">平方米</template>
                        </el-input>
                      </el-form-item>
                    </el-col>
                    <el-col :span="12">
                      <el-form-item label="法人（负责人）" >
                        <el-input
                          placeholder="请输入法人名称"
                          v-model="ruleForm.institutionInfoDTO2.person"
                          :disabled="infoStatus"
                        >
                        </el-input>
                      </el-form-item>
                    </el-col>
                  </el-row>
                  <el-row>
                    <el-col :span="12">
                      <el-form-item label="移动电话" >
                        <el-input
                          placeholder="请输入移动电话"
                          v-model="ruleForm.institutionInfoDTO2.phone"
                          :disabled="infoStatus"
                        >
                        </el-input>
                      </el-form-item>
                    </el-col>
                    <el-col :span="12">
                      <el-form-item label="机构详细地址" >
                        <el-input
                          placeholder="请输入机构详细地址"
                          v-model="ruleForm.institutionInfoDTO2.detailAddress"
                          :disabled="infoStatus"
                        >
                        </el-input>
                      </el-form-item>
                    </el-col>
                  </el-row>
                  <el-row>
                    <el-col :span="12">
                      <el-form-item label="许可时间" >
                        <el-date-picker
                          v-model="ruleForm.institutionInfoDTO2.preTime"
                          type="date"
                          :disabled="infoStatus"
                        >
                        </el-date-picker>
                      </el-form-item>
                    </el-col>
                    <el-col :span="12">
                      <el-form-item label="福利机构证书编号" >
                        <el-input
                          placeholder="请输入福利机构证书编号"
                          v-model="ruleForm.institutionInfoDTO2.orgNo"
                          :disabled="infoStatus"
                        >
                        </el-input>
                      </el-form-item>
                    </el-col>
                  </el-row>
                  <el-row>
                    <el-col :span="12">
                      <el-form-item label="民办非证书编号" >
                        <el-input
                          placeholder="请输入民办非证书编号"
                          v-model="ruleForm.institutionInfoDTO2.minBanNo"
                          :disabled="infoStatus"
                        >
                        </el-input>
                      </el-form-item>
                    </el-col>
                    <el-col :span="12">
                      <el-form-item label="设立许可证编号" >
                        <el-input
                          placeholder="请输入设立许可证编号"
                          v-model="ruleForm.institutionInfoDTO2.jianliNo"
                          :disabled="infoStatus"
                        >
                        </el-input>
                      </el-form-item>
                    </el-col>
                  </el-row>
                  <el-row>
                    <el-col :span="12">
                      <el-form-item label="工商营业执照编号" >
                        <el-input
                          placeholder="请输入工商营业执照编号"
                          v-model="ruleForm.institutionInfoDTO2.gsNo"
                          :disabled="infoStatus"
                        >
                        </el-input>
                      </el-form-item>
                    </el-col>
                    <el-col :span="12">
                      <el-form-item label="卫生许可证编号" >
                        <el-input
                          placeholder="请输入卫生许可证编号"
                          v-model="ruleForm.institutionInfoDTO2.wsNo"
                          :disabled="infoStatus"
                        >
                        </el-input>
                      </el-form-item>
                    </el-col>
                  </el-row>
                  <el-row>
                    <el-col :span="12">
                      <el-form-item label="餐饮许可证编号" >
                        <el-input
                          placeholder="请输入餐饮许可证编号"
                          v-model="ruleForm.institutionInfoDTO2.cyNo"
                          :disabled="infoStatus"
                        >
                        </el-input>
                      </el-form-item>
                    </el-col>
                    <el-col :span="12">
                      <el-form-item label="消防验收或备案类型" >
                        <el-input
                          placeholder="请输入消防验收或备案类型"
                          v-model="ruleForm.institutionInfoDTO2.xfType"
                          :disabled="infoStatus"
                        >
                        </el-input>
                      </el-form-item>
                    </el-col>
                  </el-row>
                  <el-row>
                    <el-col :span="12">
                      <el-form-item label="组织机构代码证" >
                        <el-input
                          placeholder="请输入组织机构代码证"
                          v-model="ruleForm.institutionInfoDTO2.zzNo"
                          :disabled="infoStatus"
                        >
                        </el-input>
                      </el-form-item>
                    </el-col>
                    <el-col :span="12">
                      <el-form-item label="税务登记证号" >
                        <el-input
                          placeholder="请输入税务登记证号"
                          v-model="ruleForm.institutionInfoDTO2.swNo"
                          :disabled="infoStatus"
                        >
                        </el-input>
                      </el-form-item>
                    </el-col>
                  </el-row>
                  <el-row>
                    <el-col :span="12">
                      <el-form-item label="自有资金投入" >
                        <el-input
                          placeholder="请输入自有资金投入"
                          v-model="ruleForm.institutionInfoDTO2.zy"
                          :disabled="infoStatus"
                        >
                          <template slot="append">万元</template>
                        </el-input>
                      </el-form-item>
                    </el-col>
                    <el-col :span="12">
                      <el-form-item label="当前贷款投入" >
                        <el-input
                          placeholder="请输入当前贷款投入"
                          v-model="ruleForm.institutionInfoDTO2.prensent"
                          :disabled="infoStatus"
                        >
                          <template slot="append">万元</template>
                        </el-input>
                      </el-form-item>
                    </el-col>
                  </el-row>
                  <el-row>
                    <el-col :span="12">
                      <el-form-item label="财政资金投入(公建机构)" >
                        <el-input
                          placeholder="请输入财政资金投入"
                          v-model="ruleForm.institutionInfoDTO2.cztou"
                          :disabled="infoStatus"
                        >
                          <template slot="append">万元</template>
                        </el-input>
                      </el-form-item>
                    </el-col>
                    <el-col :span="12">
                      <el-form-item label="内设医疗机构类型" >
                        <el-input
                          placeholder="请输入内设医疗机构类型"
                          v-model="ruleForm.institutionInfoDTO2.innerType"
                          :disabled="infoStatus"
                        >
                        </el-input>
                      </el-form-item>
                    </el-col>
                  </el-row>
                  <el-row>
                    <el-col :span="12">
                      <el-form-item label="内设医疗机构医保所属" >
                        <el-input
                          placeholder="请输入内设医疗机构医保所属"
                          v-model="ruleForm.institutionInfoDTO2.innerOrgDoctor"
                          :disabled="infoStatus"
                        >
                        </el-input>
                      </el-form-item>
                    </el-col>
                    <el-col :span="12">
                      <el-form-item label="内设医疗机构医保类型" >
                        <el-input
                          placeholder="请输入内设医疗机构医保类型"
                          v-model="ruleForm.institutionInfoDTO2.innerOrgDoctorType"
                          :disabled="infoStatus"
                        >
                        </el-input>
                      </el-form-item>
                    </el-col>
                  </el-row>
                  <el-row>
                    <el-col :span="12">
                      <el-form-item label="医疗合作单位级别" >
                        <el-input
                          placeholder="请输入医疗合作单位级别"
                          v-model="ruleForm.institutionInfoDTO2.level"
                          :disabled="infoStatus"
                        >
                        </el-input>
                      </el-form-item>
                    </el-col>
                    <el-col :span="12">
                      <el-form-item label="合作单位名称" >
                        <el-input
                          placeholder="请输入合作单位名称"
                          v-model="ruleForm.institutionInfoDTO2.hzOrgName"
                          :disabled="infoStatus"
                        >
                        </el-input>
                      </el-form-item>
                    </el-col>
                  </el-row>
                  <el-row>
                    <el-col :span="12">
                      <el-form-item label="机构简介信息" >
                        <el-input
                          placeholder="请输入机构简介信息"
                          v-model="ruleForm.institutionInfoDTO2.detailOrgInfo"
                          :disabled="infoStatus"
                        >
                        </el-input>
                      </el-form-item>
                    </el-col>
                    <el-col :span="12">
                      <el-form-item label="入住条件" >
                        <el-input
                          placeholder="请输入入住条件"
                          v-model="ruleForm.institutionInfoDTO2.rzRease"
                          :disabled="infoStatus"
                        >
                        </el-input>
                      </el-form-item>
                    </el-col>
                  </el-row>
                  <el-row>
                    <el-col :span="12">
                      <el-form-item label="入住程序" >
                        <el-input
                          placeholder="请输入入住程序"
                          v-model="ruleForm.institutionInfoDTO2.rzList"
                          :disabled="infoStatus"
                        >
                        </el-input>
                      </el-form-item>
                    </el-col>
                    <el-col :span="12">
                      <el-form-item label="交通环境" >
                        <el-input
                          placeholder="请输入交通环境"
                          v-model="ruleForm.institutionInfoDTO2.trafficEnvironment"
                          :disabled="infoStatus"
                        >
                        </el-input>
                      </el-form-item>
                    </el-col>
                  </el-row>
                  <el-row>
                    <el-col :span="12">
                      <el-form-item label="周边医疗机构" >
                        <el-input
                          placeholder="请输入周边医疗机构"
                          v-model="ruleForm.institutionInfoDTO2.arroundMedicalinstitution"
                          :disabled="infoStatus"
                        >
                        </el-input>
                      </el-form-item>
                    </el-col>
                    <el-col :span="12">
                      <el-form-item label="周边旅游景点" >
                        <el-input
                          placeholder="请输入周边旅游景点"
                          v-model="ruleForm.institutionInfoDTO2.arroundScenic"
                          :disabled="infoStatus"
                        >
                        </el-input>
                      </el-form-item>
                    </el-col>
                  </el-row>
                </div>
              </el-form>
            </el-col>
          </el-row>
        </div>
      </div>
    </div>
  </page-frame>
</template>

<script>
  import organizationApi from '../../service/corporation/organizationApi';
  import commonJs from '../../config/common';
  export default {
    data() {
      return {
        indexP:0,
        indexC:0,
        ways:0,//0:默认；1:添加；2:编辑
        infoStatus:false,
        treeStatus:false,
        addOrgButtonStatus:false,
        saveStatus:false,
        orgDetailStatus:false,
        ruleForm:{
          institutionEmpDTO: [
            {
              emId: 0,
              emName: "",
              emNo: ""
            },
          ],
          institutionInfoDTO: {
            address: "",
            city: "",
            district: "",
            orgId: null,
            orgName: "",
            orgNo: "",
            parentId: 0,
            phone: "",
            province: "",
            type: null
          },
          institutionInfoDTO2: {
            orgRegion: "",
            orgType: "",
            designBeds: "",
            resource: null,
            floorArea: "",
            sourceOfRealEstate: "",
            coveredArea: "",
            person: "",
            phone: "",
            detailAddress: "",
            preTime: "",
            orgNo: "",
            minBanNo: "",
            jianliNo: "",
            gsNo: "",
            wsNo: "",
            cyNo: "",
            xfType: "",
            zzNo: "",
            swNo: "",
            zy: "",
            prensent: "",
            cztou: "",
            innerType: "",
            innerOrgDoctor: "",
            innerOrgDoctorType: "",
            level: "",
            rzRease: "",
            rzList: "",
            trafficEnvironment: "",
            arroundMedicalinstitution: "",
            arroundScenic: "",
          },

        },
        rules:{},
        orgType:'',
        orgTypeOptions:[{
            value: 1,
            label: '机构养老'
          }, {
            value: 2,
            label: '居家养老'
          },{
            value: 3,
            label: '社区养老'
          },{
            value: 4,
            label: '助餐点'
          },{
            value: 5,
            label: '助浴点'
          },{
            value: 6,
            label: '居家养老服务中心'
          },{
            value: 7,
            label: '日间照料中心'
          },{
            value: 8,
            label: '护理站'
          },{
            value: 0,
            label: '其他'
          }
        ],
        filterText: '',
        orgId: 0,
        oldOrgId:null,
        parentId:0,
        params:{
          list:[],
          inParams:{
            pid:"parentId",
            rootId:0,
            id:'orgId',
          },
          outParams:{
            children:"children",
            parentId:"parentId",
            orgId:'orgId',
            orgNo:'orgNo',
            orgName:'orgName',
          },
          sort:{
            orderBy:["parentId","orgId"],
            sort:"asc",
          }
        },
        orgTree: [],
        defaultProps: {
          children: 'children',
          label: 'orgName',
          id:'orgId',
          orgNo:'orgNo',
          parentId:'parentId',
        },
        initProvince:'',
        province:'',
        provinceOptions:[],
        city:'',
        initCity:'',
        cityOptions:[],
        area:'',
        areaOptions:[],
      }
    },
    filters: {},
    methods: {
      init(){
        this.loadTableData();
      },
      /**
       * 手机号码校验
       */
      checkPhoneNumber(){
        let phoneStatus = commonJs.checkPhone(this.ruleForm.institutionInfoDTO.phone);
        if(!phoneStatus){//手机格式不对
          this.$message({
            message: '手机号码格式不正确，请重新输入',
            type: 'warning'
          });
          return false;
        }
      },
      /**
       * 加载机构树
       */
      loadTableData(){
        let self = this;
//        加载机构列表
        organizationApi.getAllInstitutionInfo().then(
          (response)=>{
            if(response.data.data[0]==''){//没有数据
              self.params.list = [];
              self.getAddButtonStatus(self.params.list);
            }else{
              self.params.list = response.data.data;
              let organizationTree = listToTree(self.params);
              self.orgTree = organizationTree;
              self.getAddButtonStatus(self.params.list);
            }
          }
        );
//        加载省级列表
        self.getRegion(1);
//        隐藏详情模块
        self.orgDetailStatus = false;
      },
      /**
       * 判断是否显示"添加按钮"
       */
      getAddButtonStatus(list){
        if(list.length==0){//没有数据
          this.treeStatus = false;
          this.addOrgButtonStatus = true;
        }else{
          this.treeStatus = true;
          this.addOrgButtonStatus = false;
        }
      },
      /**
       * 查询省级列表
       */
      getRegion(level){
        organizationApi.getRegionList(level).then(
          (response)=>{
            this.provinceOptions = response.data.data;
          }
        );
      },
      /**
       * 省级列表change
       */
      changeProvince(){
        this.indexP = this.indexP+1;
        if(this.province==''){

        }else{
          if(this.indexP==1){//编辑时初始化数据
            this.getPCD(2,this.province,1);
          }else{
            this.city = '';
            this.area = '';
            this.cityOptions = [];
            this.areaOptions = [];
            this.getPCD(2,this.province,1);
          }
        }
      },
      /**
       * 查询市/区
       */
      getPCD(level,pno,way){
        organizationApi.getPNO(level,pno).then(
          (response)=>{
            if(way==1){//1:查询市
              this.cityOptions = response.data.data;
            }else{//2:查询区
              this.areaOptions = response.data.data;
            }
          }
        );
      },
      /**
       * 市级列表change
       */
      changeCity(){
        this.indexC = this.indexC+1;
        if(this.city==''){
          //什么都不做
        }else{
          if(this.indexC==1){
            this.getPCD(3,this.city,2);
          }else{
            this.area = '';
            this.getPCD(3,this.city,2);
          }
        }
      },
      /**
       * 提交
       */
      save(formName){
        let self = this;
        this.$refs[formName].validate((valid) => {
          if (valid) {
//            添加省市区
            self.ruleForm.institutionInfoDTO.province=self.province;
            self.ruleForm.institutionInfoDTO.city=self.city;
            self.ruleForm.institutionInfoDTO.district=self.area;
//            添加机构
            self.ruleForm.institutionInfoDTO.type = self.orgType;

            if(self.ruleForm.institutionInfoDTO.orgName==''||self.ruleForm.institutionInfoDTO.orgName==null){
              self.$message({
                message: '请输入养老院名称',
                type: 'warning'
              });
              return false;
            }
            if(self.orgType==''||self.orgType==null){
              self.$message({
                message: '请选择机构类型',
                type: 'warning'
              });
              return false;
            }
            if(self.province==''||self.province==null){
              self.$message({
                message: '请选择省份',
                type: 'warning'
              });
              return false;
            }
            if(self.city==''||self.city==null){
              self.$message({
                message: '请选择城市',
                type: 'warning'
              });
              return false;
            }
            if(self.area==''||self.area==null){
              self.$message({
                message: '请选择区',
                type: 'warning'
              });
              return false;
            }
            if(self.ruleForm.institutionInfoDTO.address==''||self.ruleForm.institutionInfoDTO.address==null){
              self.$message({
                message: '请填写具体位置',
                type: 'warning'
              });
              return false;
            }
            if(self.ruleForm.institutionInfoDTO.phone==''||self.ruleForm.institutionInfoDTO.phone==null){
              self.$message({
                message: '请填写管理员联系方式',
                type: 'warning'
              });
              return false;
            }

            //判断手机号码
            let phoneStatus = commonJs.checkPhone(self.ruleForm.institutionInfoDTO.phone);
            if(!phoneStatus){//手机格式不对
              self.$message({
                message: '手机号码格式不正确，请重新输入',
                type: 'warning'
              });
              return false;
            }

            //(添加机构)保存
            if(self.ways == 1){
              self.ruleForm.institutionInfoDTO.parentId = self.orgId;
              //添加人员
              self.ruleForm.institutionEmpDTO = [];
              organizationApi.addInstitution(self.ruleForm).then(
                (response)=>{
                  if(response.data.status==200){
                    self.saveStatus = false;
                    self.$message({
                      message: '恭喜您，添加机构成功！',
                      type: 'success'
                    });
                    self.ruleForm.institutionInfoDTO2 = {
                      orgRegion: "",
                      orgType: "",
                      designBeds: "",
                      resource: null,
                      floorArea: "",
                      sourceOfRealEstate: "",
                      coveredArea: "",
                      person: "",
                      phone: "",
                      detailAddress: "",
                      preTime: "",
                      orgNo: "",
                      minBanNo: "",
                      jianliNo: "",
                      gsNo: "",
                      wsNo: "",
                      cyNo: 0,
                      xfType: "",
                      zzNo: "",
                      swNo: "",
                      zy: "",
                      prensent: "",
                      cztou: "",
                      innerType: "",
                      innerOrgDoctor: "",
                      innerOrgDoctorType: "",
                      level: "",
                      rzRease: "",
                      rzList: "",
                      trafficEnvironment: "",
                      arroundMedicalinstitution: 0,
                      arroundScenic: "",
                    };
                    self.loadTableData();
                  }else{
                    if(response.data.data.msg=='手机号码已经存在，添加失败'){
                      self.$message({
                        message: '手机号码已经存在，添加失败',
                        type: 'error'
                      });
                    } else if(response.data.data.msg=='父机构无管理员，添加失败') {
                      self.$message({
                        message: '父机构无管理员，添加失败',
                        type: 'error'
                      });
                    }
                    else{
                      self.$message({
                        message: '添加机构失败',
                        type: 'error'
                      });
                    }
                  }
                },
                (response)=>{

                }
              );
            //(编辑机构)保存
            }else if(self.ways == 2){
              self.ruleForm.institutionInfoDTO.parentId = self.parentId;
              organizationApi.updateInstitution(self.ruleForm).then(
                (response)=>{
                  if(response.data.status==200){
                    self.$message({
                      message: '恭喜您，编辑机构成功！',
                      type: 'success'
                    });
                    self.saveStatus = false;
                    self.loadTableData();
                  }else{
                    if(response.data.data.msg=='手机号码已经存在，编辑失败'){
                      self.$message({
                        message: "手机号码已经存在，编辑失败",
                        type: 'error'
                      });
                    }else{
                      self.$message({
                        message: "编辑机构失败",
                        type: 'error'
                      });
                    }
                  }
                },
              );
            }
          } else {
            return false;
          }
        });
      },
      /**
       * 添加机构(左侧列表 操作)
       */
      append(store, data, e) {
        e.stopPropagation();
        let self = this;
        self.orgDetailStatus = true;
        self.saveStatus = true;
        self.infoStatus = false;
        self.ways=1;
        //添加机构之前清空旧的数据
        self.ruleForm.institutionInfoDTO = {};
        self.province='';
        self.city='';
        self.area='';
        //将parentId传给orgId;
        self.orgId = data.orgId;
      },
      /**
       * 添加机构(右侧按钮 当左侧没有机构列表时才会显示)
       */
      addOrg(){
        this.treeStatus = true;
        this.orgDetailStatus = true;
        this.addOrgButtonStatus = false;
        this.saveStatus = true;
        this.ways=1;
      },
      /**
       * 编辑
       */
      edit(store, data, e){
        let self = this;
        e.stopPropagation();
        self.orgDetailStatus = true;
        self.saveStatus = true;
        self.infoStatus = false;
        self.parentId = data.parentId;
        self.ways=2;
        if(self.oldOrgId==data.orgId){//先点击详情再点击编辑,此时indexP置为1
          self.indexP = 1;
          self.indexC = 1;
        }else{
          self.indexP = 0;
          self.indexC = 0;
        }
        self.getInstitutionInfo(data.orgId);

//
//        if(window.pageYOffset|| document.documentElement.scrollTop || document.body.scrollTop){
//          document.getElementsByClassName('frame-container').scrollTop = 0;
//        }
      },
      /**
       * 获取机构详情
       */
      getInstitutionInfo(orgId){
        let self = this;
        organizationApi.getInstitutionInfoByOrgId(orgId).then(
          (response)=>{
            self.ruleForm.institutionInfoDTO = response.data.data.institutionInfoDTO;
            //将初始化得到的省份赋值给initProvince,作为备份
//            self.initProvince = self.ruleForm.institutionInfoDTO.province;
            self.province=self.ruleForm.institutionInfoDTO.province;
//            self.initCity=self.ruleForm.institutionInfoDTO.city;
            self.city=self.ruleForm.institutionInfoDTO.city;
            self.area=self.ruleForm.institutionInfoDTO.district;
            self.orgType = self.ruleForm.institutionInfoDTO.type;
          }
        );
        self.oldOrgId = orgId;
      },
      /**
       * 删除
       */
      remove(store, data, e) {
        e.stopPropagation();
        let self = this;
        self.$confirm('确定删除该机构', '删除机构', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          organizationApi.deleteInstitution(data.orgId).then(
            (response)=>{
              self.loadTableData();
              self.$message({
                type: 'success',
                message: '删除成功!'
              });
              //判断树结构节点数目 为0时清空右侧表单
              if(self.params.list.length==0){
                ruleForm.institutionInfoDTO={
                    address: "",
                    city: "",
                    district: "",
                    orgId: null,
                    orgName: "",
                    orgNo: "",
                    parentId: 0,
                    phone: "",
                    province: "",
                    type: null
                };
                self.saveStatus = true;
              }
            }
          );
      }).catch(() => {
          self.$message({
            type: 'info',
            message: '已取消删除'
          });
        });
      },

      renderContent(h, {node, data, store}) {
        return (
          <span>
            <span>
              <span>{node.label}</span>
            </span>
            <span style="float: right; margin-right: 20px">
              <el-button type="text" class="btnLightBlack append" size="mini" on-click={ (e) => this.append(store, data , e) }>添加</el-button>
              <el-button type="text" class="btnLightBlack" size="mini" on-click={ (e) => this.edit(store, data, e) }>编辑</el-button>
              <el-button type="text" size="mini" on-click={ (e) => this.remove(store, data, e) }>删除</el-button>
            </span>
          </span>);
      },
      /**
       * 树的筛选
       */
      filterNode(value,data) {
        if (!value) return true;
        return data.orgName.indexOf(value) !== -1;
      },
      /**
       * 点击树显示机构详细信息
       */
      handleNodeClick(data){
        let self = this;
        self.orgDetailStatus = true;
        self.saveStatus = true;
        self.infoStatus = true;
        self.saveStatus = false;
        self.orgId = data.orgId;
        self.indexP = 0;
        self.indexC = 0;
        self.getInstitutionInfo(data.orgId);
      },
    },
    mounted: function () {
      this.init();
    },
    watch: {
      filterText(val) {
        this.$refs.tree2.filter(val);
      },
    },
  }
</script>
<style>

  /*@media screen and (min-width:1365px){*/
    /*.box-card .el-card__body .el-input{*/
      /*width:76%!important;*/
    /*}*/
    .org .warnTips{
      margin-left:30px;
    }
  .input input{
    display: inline-block;
  }
  .el-select {
    display: block;
    position: relative;
  }
  .treeTop{
    /*margin-top:20px;*/
  }
  .width66{
    width:62%!important;
  }
  .org .location .province,.org .location .city,.org .location .area{
    width:32%!important;
  }
  .org .warn{
    color:red;
    font-size: 15px;
  }
  .org .attention{
    text-align:right;
  }
  .org .el-tree-node__children .append{
    /*display:none;*/
  }
  .org .el-form-item .el-form-item__label:before {
    content: "*";
    color: #ff4949;
    margin-right: 4px;
  }
  .org .other .el-form-item .el-form-item__label:before {
    content: "";
  }

  .org .warnTips{
    margin-left:20px;
  }
  .org .buildingEdit2 {
    width:90%;
    float: left;
    padding: 20px 10px;
    background-color: #EFF2F7;
    box-shadow: -1px 2px 5px #cccccc;
    margin-bottom: 30px;
  }
  .org  .buildingEdit2 .el-input{
    margin-bottom: 5px;
    width: 100%!important;
  }
  .org .el-input-group.el-input-group--append{
    display: inline-table!important;
  }



</style>
